<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>修改文档</title>
    <link rel="stylesheet" type="text/css" href="/static/hplus/css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="/static/hplus/css/plugins/iCheck/custom.css">
    <link rel="stylesheet" type="text/css" href="/static/hplus/css/style.css">
    <link rel="stylesheet" type="text/css" href="/static/layer/skin/layer.css">
    <style type="text/css">
        .col-sm-10 {width: 320px;display: inline-block;}
        .col-sm-2 {text-align: right;width: 125px;}
        .must {color: #ff0000;font-size: 19px;float: right;margin-left: 5px;}
    </style>
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-content">
                    <form class="form-horizontal" onsubmit="return false">
                        <div class="form-group">
                            <label class="col-sm-2 control-label">文档名称<span class="must">*</span></label>
                            <div class="col-sm-10">
                                <input type="text" class="form-control" name="name" autocomplete="off" value="{$doc.name}">
                            </div>
                        </div>
                        <div class="hr-line-dashed"></div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label" style="vertical-align: top">文档描述</label>
                            <div class="col-sm-10">
                                <textarea class="form-control" name="description" rows="5" style="resize: none">{$doc.description}</textarea>
                            </div>
                        </div>
                        <div class="hr-line-dashed"></div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">是否公开</label>
                            <div class="col-sm-10">
                                <div class="radio i-checks">
                                    <label class>
                                        <div class="iradio_square-green">
                                            {if($doc.is_open===1)}
                                            <input type="radio" value="1" name="is_open" style="position: absolute; opacity: 0;" checked="checked">
                                            {else/}
                                            <input type="radio" value="1" name="is_open" style="position: absolute; opacity: 0;">
                                            {/if}
                                            <ins class="iCheck-helper"></ins>
                                        </div>
                                        是</label>
                                    <label class>
                                        <div class="iradio_square-green">
                                            {if($doc.is_open===0)}
                                            <input type="radio" value="0" name="is_open" style="position: absolute; opacity: 0;" checked="checked">
                                            {else/}
                                            <input type="radio" value="0" name="is_open" style="position: absolute; opacity: 0;">
                                            {/if}
                                            <ins class="iCheck-helper"></ins>
                                        </div>
                                        否</label>
                                </div>
                            </div>
                        </div>
                        <div class="hr-line-dashed"></div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label">文档密码</label>
                            <div class="col-sm-3">
                                <input type="password" class="form-control" name="password" autocomplete="off">
                            </div>
                            <div class="col-sm-3">
                                <input class="btn btn-primary" type="button" id="save" value="保存"> &nbsp; <a class="btn btn-default" id="cancel">取消</a>
                            </div>
                        </div>
                        <div class="hr-line-dashed"></div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label"></label>
                            <div class="col-sm-12" style="text-align: right">
                                <input class="btn btn-success" type="button" id="add" value="创建章节">
                            </div>
                        </div>
                    </form>
                </div>
                <div class="ibox-content">
                    <table id="treeTable"></table>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script type="text/javascript" src="/static/hplus/js/jquery.min.js?v={php}echo time(){/php}"></script>
<script type="text/javascript" src="/static/hplus/js/plugins/iCheck/icheck.min.js?v={php}echo time(){/php}"></script>
<script type="text/javascript" src="/static/layer/layer.js?v={php}echo time(){/php}"></script>
<script type="text/javascript" src="/static/royui/royui.min.js?v={php}echo time(){/php}"></script>
<script type="text/javascript">
    $(function () {
        $(".i-checks").iCheck({checkboxClass: "icheckbox_square-green", radioClass: "iradio_square-green"});
        royui('#treeTable').treeTable({
            elem: '#treeTable',
            url: '/doc/ajaxDoc',
            method: 'post',
            //is_cache: false,
            count: {$count},
            total_page: true,
            paging: true,
            pagesize: {$pagesize},
            show_pages: 5,
            cols: [
                {
                    field: 'sort',
                    title: '排序',
                    title_style: 'cursor:pointer',
                    is_sort: true
                },
                {
                    title: '接口名称',
                    template: function ($item) {
                        return '<a href="/doc/editArticle?id=' + $item.id + '" class="royui-button-a">' + $item.name + '</a>'
                    }
                },
                {
                    field: 'ctime',
                    title: '创建时间',
                    title_style: 'cursor:pointer',
                    is_sort: true
                },
                {
                    field: 'mtime',
                    title: '修改时间',
                    title_style: 'cursor:pointer',
                    is_sort: true
                },
                {
                    title: '操作',
                    action: [{
                        matter: 'edit',
                        url: '/doc/editArticle',
                        method: 'self'
                    }, {matter: 'del', url: '/doc/delArticle'}]
                }
            ]
        })
        // 保存修改
        $('#save').click(function () {
            let $name = $('[name="name"]'), $description = $('[name="description"]').val(), $is_open = parseInt($('[name="is_open"]:checked').val()), $password = $('[name="password"]').val()
            if ($name.val() === '') {
                layer.msg('文档名称不能为空', {icon: 5, time: 1000}, function () {
                    $name.focus()
                })
                return false
            }
            if ($is_open === 0 && $password === '' && '{$doc.password}' === '') {
                layer.msg('不公开文档密码不能为空', {icon: 5, time: 1000})
                return false
            }
            $.ajax({
                type: 'post', dataType: 'json', cache: false,
                url: '/doc/edit',
                data: {'id': '{$doc.id}', 'name': $name.val(), 'description': $description, 'is_open': $is_open, 'password': $password},
                success: function ($data) {
                    if ($data.code === 200) {
                        layer.msg($data.message, {icon: 1, time: 1000}, function () {location.reload()})
                    } else {
                        layer.msg($data.message, {icon: 5, time: 1000})
                    }
                }
            })
        })
        // 取消
        $('#cancel').click(function () {
            window.location.href = '/doc/lists'
        })
        let $open = null;
        $('#add').click(function () {
            $open = layer.open({
                type: 2,
                title: '创建接口',
                content: '/doc/addArticle',
                area: ['600px', '700px'],
                closeBtn: 2,
                btn: ['确定', '取消'],
                yes: function ($index, $layero) {
                    let $body = $layero.find('iframe').contents().find('body');
                    let $param = decodeURIComponent($($body).find('form').serialize());
                    $param = $param.split('&');
                    let $params = {};
                    $($param).each(function ($n, $obj) {
                        $params[$obj.split('=')[0]] = $obj.split('=')[1];
                    });
                    if (!$params.name) {
                        layer.msg('接口名称不能为空', {icon: 5, time: 1000});
                        return false
                    }
                    $params.doc_id = '{$doc.id}'
                    $.ajax({
                        type: 'post', dataType: 'json', cache: false,
                        url: '/doc/addArticle',
                        data: $params,
                        success: function ($data) {
                            if ($data.code === 200) {
                                layer.msg($data.message, {icon: 1, time: 1200}, function () {
                                    layer.close($open);
                                    window.location.reload();
                                });
                            } else {
                                layer.msg($data.message, {icon: 5});
                            }
                        }
                    })
                }
            })
        })
    });
</script>
</html>
